<template>
    <div class="sourcePage">
        <ul class="main">
            <li v-for="(item,index) of sources" :key="index">
                <img :src="item.src" alt="">
                <span>{{item.name}}</span>
                <span>{{item.data}}</span>
                <span>{{item.unit}}</span>
            </li>
        </ul>
    </div>
</template>

<script>
export default {
    data(){
        return{
            sources:[
                {
                    name:'防爆头盔',
                    data:'5,685',
                    unit:'(个)',
                    src:require('../../../../static/images/commonServer/routes/96121.png')
                },{
                    name:'防刺服',
                    data:'8,650',
                    unit:'(套)',
                    src:require('../../../../static/images/commonServer/routes/短信.png')
                },{
                    name:'防割手套',
                    data:'5,683',
                    unit:'(双)',
                    src:require('../../../../static/images/commonServer/routes/微信.png')
                },{
                    name:'橡胶警棍',
                    data:'8,690',
                    unit:'(根)',
                    src:require('../../../../static/images/commonServer/routes/微博.png')
                },{
                    name:'强光手电筒',
                    data:'1,265',
                    unit:'(个)',
                    src:require('../../../../static/images/commonServer/routes/钉钉.png')
                },{
                    name:'灭火器',
                    data:'5,050',
                    unit:'(个)',
                    src:require('../../../../static/images/commonServer/routes/传真.png')
                },{
                    name:'便携阻车器',
                    data:'1,245',
                    unit:'(个)',
                    src:require('../../../../static/images/commonServer/routes/广播.png')
                },{
                    name:'轮椅',
                    data:'5,054',
                    unit:'(辆)',
                    src:require('../../../../static/images/commonServer/routes/网页.png')
                },{
                    name:'AED',
                    data:'1,276',
                    unit:'(套)',
                    src:require('../../../../static/images/commonServer/routes/影视.png')
                },{
                    name:'应急药箱',
                    data:'7,866',
                    unit:'(个)',
                    src:require('../../../../static/images/commonServer/routes/抖音.png')
                },
            ]
        }
    }
}
</script>

<style lang="scss" scoped>
    .sourcePage{
        flex:1.5;
        padding-left:2rem;
        box-sizing:border-box;
        .main{
            width:100%;
            height:100%;
            li{
                float:left;
                width:50%;
                height:20%;
                img{
                    width:1.7rem;
                    height:1.5rem;
                    vertical-align: middle;
                }
                span{
                    margin-left:.6rem;
                    color:#ffffff;
                    &:nth-of-type(2){
                        color:#00FFFF;
                        font-size:1.4rem;
                    }
                }
            }
        }   
    }
</style>